<template>
<div class="graph-detail-wrapper">
    <div class="panel">
        <graph-panel :graph-options="graphOptions"   :paneltype="'edit'"  :datasource="datasource" :graphType="graphType"></graph-panel>
    </div>
</div>
</template>

<script>
import GraphPanel from '../../../components/panels/graph-panel.vue';
export default {
    components: {
        GraphPanel
    },
    data(){
        return {
            graphOptions:{}
        }
    },
    props: ['args'],

    computed: {
        datasource() {
            return JSON.parse(this.args.datasource);
        },
        graphType() {
            return this.args.graphType;
        }
    },
    watch:{
        args:function(newvalue,oldvalue){
            this.graphOptions =JSON.parse(newvalue.graphOptions);
        }
    },
    mounted(){
        this.graphOptions =JSON.parse(this.args.graphOptions);
    } 
}
</script>

<style lang="less">
.graph-detail-wrapper{
    height: 100%;;
}
</style>
